<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="html" tagdir="/WEB-INF/tags/html"%>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<c:url value="/applicationForm.htm" var="applicationForm" />

<html>
<head>
	<title>Index</title>
	
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	<html:stylesheet url="bootstrap/css/bootstrap.css" />
	<html:stylesheet url="bootstrap/css/bootstrap-responsive.css" />
	<html:stylesheet url="style/fuild.css" />
	
	<!-- Devrait se trouver en bas de page -->
	<html:script url="js/jquery.js" />
	<html:script url="bootstrap/js/bootstrap.js" />
</head>
<body>

	<div class="navbar navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container-fluid">
				
				<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</a>
			
				<div class="nav-collapse">
					<ul class="nav">
		              <li class="active"><a href="#"><i class="icon-user icon-white"></i> Home</a></li>
					  <li><a href="#about"><i class="icon-user"></i> User</a></li>
		              <li><a href="#about"><i class="icon-download "></i> Downlaod</a></li>
					  <li><a href="#about"><i class="icon-upload "></i> Upload</a></li>
					  <li><a href="#about"><i class="icon-play-circle  "></i> Play Circle</a></li>
					  <li><a href="#about"><i class="icon-bookmark  "></i> Bookmark</a></li>
		              <li><a href="#about"><i class="icon-gift "></i> Gift</a></li>
		            </ul>

					<p class="navbar-text pull-right">
						Logged in as <a href="#">username</a>
					</p>
				</div>
			</div>
		</div>
	</div>

	<div class="container-fluid">
		<div class="row-fluid">
			<div class="span3">
				<div class="well sidebar-nav">
					<ul class="nav nav-list">

						<li class="nav-header">Frontend</li>
						<li class="active"><a href="#">HTML 4.01</a></li>
						<li><a href="#">HTML5</a></li>
						<li><a href="#">CSS</a></li>
						<li><a href="#">JavaScript</a></li>
						<li><a href="#">Twitter Bootstrap</a></li>
						<li><a href="#">Firebug</a></li>

						<li class="nav-header">Backend</li>
						<li><a href="#">PHP</a></li>
						<li><a href="#">SQL</a></li>
						<li><a href="#">MySQL</a></li>
						<li><a href="#">PostgreSQL</a></li>
						<li><a href="#">MongoDB</a></li>
					</ul>
				</div>
			</div>

			<div class="span9">
				<div>
					<h1>Heading 1</h1>
		            <h2>Heading 2</h2>
		            <h3>Heading 3</h3>
		            <h4>Heading 4</h4>
		            <h5>Heading 5</h5>
		            <h6>Heading 6</h6>
		            
		            <p>This is text wrapped in paragraph. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>  
					<p>This is an example of using <strong>Strong</strong> in text.</p>  
					<p>This is an example of using <em>emphasis</em> in text.</p>  
					<p>Headquarters of the <abbr title="United Nations">UN</abbr> is in Geneva, Austria.</p>
					
					<address>  
				        <strong>w3resource</strong><br>  
        				21 Ramkrishna Road<br>  
    					Burdwan, WB 713101<br>  
					</address> 
					
					<blockquote>  
					 	<p>You can't say A is made of B or vice versa. All mass is interaction.</p>  
					  	<small>Statement titled "Principles" (c. 1950), quoted in Genius : The Life and Science of Richard Feynman (1992) by James Gleick</small>  
					</blockquote>  
					
					<h3>This is an unordered list</h3>  
					<ul>  
					  <li>HTML5</li>  
					  <li>CSS3</li>  
					  <li>JavaScript</li>  
					  <li>PHP</li>  
					  <li>DataBases  
					    <ul>  
					      <li>MySQL</li>  
					      <li>POstgreSQL</li>  
					      <li>MS SQL Server</li>  
					    </ul>  
					  </li>  
					  <li>Tools and APIs</li>  
					  <li>JOSN</li>  
					  <li>C Language</li>  
					</ul>  
					
					<h3>This is an ordered list</h3>  
					<ol>  
					  <li>HTML5</li>  
					  <li>CSS3</li>  
					  <li>JavaScript</li>  
					  <li>PHP</li>  
					  <li>DataBases  
					    <ul>  
					      <li>MySQL</li>  
					      <li>PostgreSQL</li>  
					      <li>MS SQL Server</li>  
					    </ul>  
					  </li>  
					  <li>Tools and APIs</li>  
					  <li>JOSN</li>  
					  <li>C Language</li>  
					</ol> 
					
					<h3>Description list</h3>  
					<dl>  
					  <dt>Ten years ago</dt>  
					  <dd>a crack commando unit was sent to prison</dd>  
					  
					  <dt>by a military court </dt>  
					  <dd>for a crime they didn't commit.</dd>  
					  <dd>These men promptly escaped from.</dd>  
					  
					  <dt>a maximum security stockade to the Los Angeles underground.</dt>  
					  <dd>Today, still wanted by the government, they survive as soldiers of fortune.</dd>  
					</dl>  
					
					<h3>Horizontal Description list</h3>  
					<dl class="dl-horizontal">  
					  <dt>Ten years ago</dt>  
					  <dd>a crack commando unit was sent to prison</dd>  
					  
					  <dt>by a military court </dt>  
					  <dd>for a crime they didn't commit.</dd>  
					  <dd>These men promptly escaped from.</dd>  
					  
					  <dt>a maximum security stockade to the Los Angeles underground.</dt>  
					  <dd>Today, still wanted by the government, they survive as soldiers of fortune.</dd>  
					</dl>  

				</div>

				<div class="row-fluid">
					<div class="span9">
						<h3>Table exemple</h3>
						<table class="table table-striped">  
							<thead>
								<tr>
									<th>Student ID</th>
									<th>First name</th>
									<th>Last name</th>
									<th>Grade</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>001</td>
									<td>Rammona</td>
									<td>Reddy</td>
									<td>A+</td>
								</tr>
								<tr>
									<td>002</td>
									<td>Smita</td>
									<td>pallod</td>
									<td>A+</td>
								</tr>
								<tr>
									<td>003</td>
									<td>Truc</td>
									<td>Much</td>
									<td>A+</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				
				<div class="row-fluid">
					<div class="span12">
						<h3>Formulaire</h3>
						<form class="well form-horizontal">
						
							<div class="control-group">
								<label class="control-label">Label name</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something...">
									<span class="help-inline">Associated help text!</span>
									<p class="help-block">je suis une aide ;)</p>
								</div>
							</div>
							
							<div class="control-group">
								<label class="control-label">Read only</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something..." readonly="true">
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
							
							<div class="control-group">
								<label class="control-label">Disabled</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something..." disabled>
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
							
							<div class="control-group">
								<label class="control-label">Label name</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something...">
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
						
							<div class="control-group success">
								<label class="control-label" for="inputSuccess">Success</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something...">
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
							
							<div class="control-group warning">
								<label class="control-label" for="inputWarning">Warning</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something...">
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
							
							<div class="control-group error">
								<label class="control-label" for="inputError">Error</label>
								<div class="controls">
									<input type="text" class="span3" placeholder="Type something...">
									<span class="help-inline">Associated help text!</span>
								</div>
							</div>
							
							<div class="control-group">
								<label class="control-label">Select</label>
								<div class="controls">
									<select>
										<option>1</option>
										<option>2</option>
										<option>3</option>
										<option>4</option>
										<option>5</option>
									</select>
								</div>
							</div>
							
							<div class="control-group">
				           		<label class="control-label" for="multiSelect">Multicon-select</label>
				            	<div class="controls">
				              		<select multiple="multiple" id="multiSelect">
				                		<option>1</option>
				                		<option>2</option>
				                		<option>3</option>
				                		<option>4</option>
				                		<option>5</option>
				              		</select>
				            	</div>
				          </div>
				          
				          <div class="control-group">
				          	<label class="control-label" for="fileInput">File input</label>
				          	<div class="controls">
				            	<input class="input-file" id="fileInput" type="file">
				            </div>
				          </div>
				          
				          <div class="control-group">
				          	<label class="control-label" for="textarea">Textarea</label>
				            <div class="controls">
				              <textarea class="input-xlarge" id="textarea" rows="3"></textarea>
				            </div>
				          </div>
							
							<input type="text" class="span3" placeholder="Type something...">
							<span class="help-inline">Something went wrong!!</span>
							
							<label class="checkbox">
								<input type="checkbox"> check me out
							</label>
							
							<button type="submit" class="btn btn-primary">Save changes</button>
							<button type="submit" class="btn">Submit</button>
						</form>
					</div>
				</div>
				
				<div class="row-fluid">
					<div class="span12">
						<h3>Formulaire de recherche</h3>
						<form class="well form-search">
							<input type="text" class="input-medium search-query">
							<button type="submit" class="btn"><i class="icon-search"></i> Search</button>
						</form>
					</div>
				</div>
				
				<div class="row-fluid">
					<div class="span12">
						 <div class="btn-toolbar" style="margin-bottom: 9px">
					        <div class="btn-group">
					          <a class="btn" href="#"><i class="icon-align-left"></i></a>
					          <a class="btn" href="#"><i class="icon-align-center"></i></a>
					          <a class="btn" href="#"><i class="icon-align-right"></i></a>
					          <a class="btn" href="#"><i class="icon-align-justify"></i></a>
					        </div>
        
					        <div class="btn-group">
					          <a class="btn btn-primary" href="#"><i class="icon-user icon-white"></i> User</a>
					          <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
					          	<span class="caret"></span>
					          </a>
					          <ul class="dropdown-menu">
					            <li><a href="#"><i class="icon-pencil"></i> Edit</a></li>
					            <li><a href="#"><i class="icon-trash"></i> Delete</a></li>
					            <li><a href="#"><i class="icon-ban-circle"></i> Ban</a></li>
					            <li class="divider"></li>
					            <li><a href="#"><i class="i"></i> Make admin</a></li>
					          </ul>
					        </div>
      				</div>
      				
					<p>
					  <a class="btn" href="#"><i class="icon-refresh"></i> Refresh</a>
					  <a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-white"></i> Checkout</a>
					  <a class="btn btn-danger" href="#"><i class="icon-trash icon-white"></i> Delete</a>
					</p>
					
					<p>
					  <a class="btn btn-large" href="#"><i class="icon-comment"></i> Comment</a>
					  <a class="btn btn-small" href="#"><i class="icon-cog"></i> Settings</a>
					  <a class="btn btn-small btn-info" href="#"><i class="icon-info-sign icon-white"></i> More Info</a>
					</p>
						
						
					</div>
				
				</div>
				
				<div class="row-fluid">
					<div class="span6">
						<p>Coucou1</p>
						<p>
							<a class="btn btn-success btn-large">Join w3resource now</a>
						</p>
					</div>
					<div class="span6">
						<p>Coucou1</p>
						<p>
							<a class="btn btn-success btn-large">Join w3resource now</a>
						</p>
					</div>
				</div>
			</div>

		</div>
	</div>



</body>
</html>